import React, { Component } from 'react';

import {CreateTaskTypeStyled, } from './CreateTaskTypeStyled'

import Navigation from 'components/Navigation/Navigation'
import back from 'images/nav/whiteback@3x.png'

import UIButton from 'components/UIButton/UIButton'


import qs from "qs"
import { Toast } from 'antd-mobile'

import { userData } from 'pages/dengluzhuce/model/userData.js'
import { taskBody } from 'pages/hall/model/taskSubmit.js'

import connect from 'pages/redux-component/connect'

const difficultyArr = ['简单','高价','限制']
const taskTypeArr = ['寄放','代取','面签']
// @connct
class CreateTaskType extends Component {
  state = { 
    difficulty: 0,
    taskType: 0,
    canSubmit: false,
  }
  componentDidMount(){
    console.log(taskBody)
    if(taskBody.tname 
      && taskBody.tcontent 
      && taskBody.staplace
      && taskBody.endtime
      && taskBody.linkman
      && taskBody.linkphone
      && taskBody.price
      ){
      this.setState({
        canSubmit: true,
      })
    }else{
      this.setState({
        canSubmit: false,
      })
    }
  }
  render() {
    return (
      <CreateTaskTypeStyled>
        
        <Navigation
        title = "发布任务"
        leftMargin = '0 0 0 .15rem'
        leftWidth = '25%'
        leftHeight = '.44rem'
        leftImg = {back}
        leftImgWidth = '.2rem'
        clickLeft = {()=>this.onClickLeft("left")}
        ></Navigation>
        <div className="main">
          <p className="type">发布任务类型</p>
          <p className="typec">难度等级</p>
          <div className="btnwrap">
            {
              difficultyArr.map((value,index)=>(
                <UIButton key={index}
                selected= {index === this.state.difficulty}
                title = {value}
                width='.5rem'
                height='.5rem'
                titleColor= '#fff'
                titleSize='.13rem'
                backgroundColor = '#56D9D1'
                opacity={0.6}
                selectedOpacity={1}
                borderRadius='.05rem'
                clickButton = {()=>this.chooseDifficulty(index)}
                ></UIButton>
              ))
            }          

          </div>
          <p className="typec">任务类型</p>
          <div className="btnwrap">
          {
              taskTypeArr.map((value,index)=>(
                <UIButton key={index}
                selected= {index === this.state.taskType}
                title = {value}
                width='.5rem'
                height='.5rem'
                titleColor= '#fff'
                titleSize='.13rem'
                backgroundColor = '#56D9D1'
                opacity={0.6}
                selectedOpacity={1}
                borderRadius='.05rem'
                clickButton = {()=>this.chooseTaskType(index)}
                ></UIButton>
              ))
            } 
          </div>
          <p className="typec">注意事项</p>
          <div className="tips">
            <p>1.填写必要信息</p>
            <p>2.确保信息正确</p>
            <p>3.风萧萧兮</p>
          </div>
          
          <div className="btnwrap submit">
            <UIButton
            title='填写任务信息'
            titleColor='#fff'
            titleSize='.15rem'
            width='45%'
            height='.4rem'
            borderRadius='.2rem'
            backgroundColor='#FFB538'
            clickButton = {()=>this.writeTaskInfo()}
            >
            </UIButton>
            <UIButton
            title='发布任务'
            titleColor='#fff'
            titleSize='.15rem'
            selected={!this.state.canSubmit}
            opacity={1}
            selectedOpacity={0.5}
            width='45%'
            height='.4rem'
            borderRadius='.2rem'
            backgroundColor='#FFB538'
            clickButton = {()=>this.clickSubmit()}
            >
            </UIButton>
          </div>
        </div>
      </CreateTaskTypeStyled>
    );
  }
  writeTaskInfo(){
    console.log('填写')
    // this.props.history.push('/createTaskContent')
    this.props.history.push('/hallChildRouter/createTaskContent')
    

  }
  clickSubmit(){
    if(this.state.canSubmit){
      console.log('提交')
      console.log(taskBody)
      taskBody.degid = this.state.difficulty+1
      taskBody.tyid = this.state.taskType+1
      taskBody.id = this.props.uid||userData.uid||1
    
      console.log(taskBody)
      fetch('/Legang/task/issue',{   
        method:"POST",
        headers:{
            "Content-type":"application/x-www-form-urlencoded",
        },     
        body: qs.stringify(taskBody)
      })    
      .then(response => response.json())
      .then(result => {
        console.log(result)
      
        if(result.flag){
          for(let key in taskBody){
            taskBody[key] = null
          }
          console.log(taskBody)
          this.props.history.go(-1)

        }else{
          Toast.info(result.errorMsg)
        }
        Toast.info(result.errorMsg)
        
      })
    }else{
      Toast.info('请填写任务信息',1)

    }

  }
  chooseDifficulty(tag){
    this.setState({
      difficulty: tag,
    })
    
  }
  chooseTaskType(tag){
    console.log(tag)
    this.setState({
      taskType: tag,
    })
  }
  onClickLeft(tag){
    this.props.history.go(-1)

  }
}

export default connect(CreateTaskType);